/**
 *  预警预报应用深化-传输影响分析
 *  Created by dinghh on 2018/7/13.
 */
'use strict';
angular.module("MetronicApp").directive('weatherLive', function () {
    return {
        scope: {
            id: "@",
            data: "="
        },
        restrict: 'EA',
        template: '<div style="width: 620px;height: 300px"></div>',
        replace: true,
        link: function ($scope, element, attrs, controller) {
            function getOption(data) {
                var option = {
                    title:{
                        text:'空气质量指数：简称ACJ,是定量描述空气质量状况的无量级指数。（数据由生态环境部提供）',
                        left:'50%',
                        bottom:'5%',
                        textAlign:'center',
                        textStyle:{//标题内容的样式
                            fontSize:12//主题文字字体大小，默认为18px
                        }
                    },
                    xAxis: {
                        type: 'category',
                        data: ['10', '11', '12', '13', '14', '15', '16','17', '18', '19', '20', '21', '22', '23','00', '01', '02', '03', '04', '05', '06','07','08','09','10','(h)'],
                        splitLine:{                  //去掉网格线
                            show: false
                        },
                        axisLine: {show: false},     //去掉轴线
                        axisTick: {
                            show: false
                        },
                        axisLabel:{
                            interval:0
                        }
                    },
                    yAxis: {
                        min: 0,
                        max: 162,
                        interval: 27,
                        type: 'value',
                        splitLine:{
                            show: false
                        },
                        axisLine: {show: false},
                        axisTick: {
                            show: false
                        }
                    },
                    series: [{
                        data: [87, 89, 95, 136, 127, 146, 158,120, 100, 150, 123, 150, 124, 110,111, 136, 125, 156, 70, 120, 88,100, 92, 67],
                        type: 'bar',
                        barWidth: '50%',
                        itemStyle:{
                            normal:{
                                color:function(params){
                                    if(params.value >0 && params.value <20){
                                        return "#C6E2FF";
                                    }else if(params.value >=20 && params.value<=70 ){
                                        return "#FFF68F";
                                    }else if(params.value >=70 && params.value<=100 ){
                                        return "#FFC125";
                                    }else if(params.value >=100 && params.value<=120 ){
                                        return "#FF8247";
                                    }else if(params.value >=120 && params.value<=150 ){
                                        return "#FF3E96";
                                    }
                                    return "#FF0000";
                                }
                            }
                        }
                    }]
                };
                return option;
            }

            var myChart = echarts.init(document.getElementById($scope.id), 'macarons');
            myChart.setOption(getOption($scope.data));

            $scope.$watch('data', function (newVal, oldVal) {
                myChart.setOption(getOption(newVal));
            });
        }
    };
});
